import { checkupsStaffCreate, checkupsStaffList } from "@/api/SecondmentDictionary";
import { BasicDrawer, useDrawerInner } from "@/components/Drawer";
import { BasicForm, FormSchema, useForm } from "@/components/Form";
import { useFetchHistoryData, History } from "@/components/ViewComponents/History/index";
import { Button, Empty, message } from "antd";
import { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
const index = (props: { register: Fn }) => {
	const { t } = useTranslation();
	let [grpId, setGrpId] = useState("");
	const [supervise, setSupervise] = useState("");
	const [isShow, setIsShow] = useState(false);
	const [isHistory, setIsHistoty] = useState(false);
	const [isAddProject, setIsAddProject] = useState(true);
	const schemas = [
		{
			label: t("felix_ui.code_numb"),
			dataIndex: "cardNumb"
		},
		{
			label: t("felix_ui.full_name"),
			field: "name"
		},
		{
			label: t("felix_ui.birthyear"),
			field: "birthday"
		},
		{
			label: t("felix_ui.gender"),
			field: "gender"
		},
		{
			label: t("felix_ui.single"),
			field: "single"
		},
		{
			label: t("felix_ui.card_numb"),
			field: "grpId"
		},
		{
			label: t("felix_ui.util_date"),
			field: "utilDate"
		},
		{
			label: t("felix_ui.workplace"),
			field: "workplace"
		}
	];
	const formSchema: FormSchema[] = [
		{
			label: t("felix_ui.code_numb"),
			field: "cardNumb",
			component: "Input",
			colProps: { span: 24 }
		},
		{
			label: t("felix_ui.full_name"),
			field: "name",
			component: "Input",
			colProps: { span: 24 }
		},
		{
			label: t("felix_ui.birthyear"),
			field: "birthday",
			component: "DatePicker",
			colProps: { span: 24 }
		},
		{
			label: t("felix_ui.gender"),
			field: "gender",
			component: "Select",
			componentProps: {
				options: [
					{ label: "male", value: "1" },
					{ label: "female", value: "2" }
				]
			},
			colProps: { span: 24 }
		},
		{
			label: t("felix_ui.util_date"),
			field: "utilDate",
			component: "DatePicker",
			colProps: { span: 24 }
		}
	];
	const [registerDrawer, { closeDrawer }] = useDrawerInner(props.register, data => {
		setGrpId((grpId = data.grpId));
		setSupervise(grpId);
		setIsHistoty(true);
	});
	const [register] = useFetchHistoryData({
		api: checkupsStaffList,
		contents: "name",
		describe: t("kevin_ui.full_ame") + "：",
		schemas: schemas,
		id: supervise,
		parameter: {
			pageNo: 1,
			pageSize: 10,
			grpId
		}
	});
	const [registerForm, { getFieldsValue, resetFields }] = useForm({
		schemas: formSchema,
		labelWidth: 180
	});
	const getCheckupsStaffList = async () => {
		const res = await checkupsStaffList({
			pageNo: 1,
			pageSize: 10,
			grpId
		});
		if (res.list.length === 0) {
			setIsShow(true);
		} else {
			console.log("===>", isShow);
			setIsShow(false);
		}
	};
	const addProjectFn = () => {
		setIsAddProject(false);
		setIsShow(true);
	};
	const timeFn = (tiem: string) => {
		if (!tiem) return;
		const [date] = tiem.split(" ");
		return date;
	};
	const handleSubmit = async () => {
		if (isAddProject) return;
		const formValue = await getFieldsValue();
		formValue.birthday = timeFn(formValue.birthday);
		formValue.utilDate = timeFn(formValue.utilDate);
		formValue.grpId = grpId;
		const res = await checkupsStaffCreate(formValue);
		if (!res) {
			message.error(t("kevin_ui.addFailed"));
			return;
		}
		message.success(t("kevin_ui.addedSuccessfully"));
		resetFields();
		closeDrawer();
		getCheckupsStaffList();
		setSupervise("" + new Date().getTime());
		setIsAddProject(true);
		setIsShow(false);
	};
	useEffect(() => {
		getCheckupsStaffList();
	}, [grpId]);
	return (
		<BasicDrawer showFooter={true} size="large" {...props} register={registerDrawer} ok={handleSubmit}>
			<div>
				<Button type="link" onClick={addProjectFn}>
					New personnel added
				</Button>
				<div style={{ display: isShow ? "none" : "block" }}>{isHistory ? <History register={register}></History> : ""}</div>
				<div style={{ display: isShow ? "block" : "none" }}>
					<div style={{ display: isAddProject ? "block" : "none" }}>
						<Empty />
					</div>
					<div style={{ display: !isAddProject ? "block" : "none" }}>
						<BasicForm register={registerForm}></BasicForm>
					</div>
				</div>
			</div>
		</BasicDrawer>
	);
};
export default index;
